<!-- quirks mode -->
<script src="../../resources/js-test.js"></script>
<style>
:hover::before, :hover::after { background-color: green }
#t1::before { content: "Green background when hovered" }
#t2::after { content: "Green background when hovered" }
</style>
<div id="t1"></div>
<div id="t2"></div>
<script>
description("Quirks mode - universal :hover on pseudo elements");

function moveTo(element) {
    eventSender.mouseMoveTo(element.offsetLeft + 1,  element.offsetTop + 1);
}

var transparent = "rgba(0, 0, 0, 0)";
var green = "rgb(0, 128, 0)";

shouldBeDefined("window.eventSender");

shouldBe("getComputedStyle(t1, '::before').backgroundColor", "transparent");
moveTo(t1);
shouldBe("getComputedStyle(t1, '::before').backgroundColor", "green");

shouldBe("getComputedStyle(t2, '::after').backgroundColor", "transparent");
moveTo(t2);
shouldBe("getComputedStyle(t2, '::after').backgroundColor", "green");
</script>
